<template>
  <div
    class="flex flex-col w-full h-full p-2 hide-scrollbar"
    style="background: #E5E5E5"
  >
    <div class="flex-1">
      <img src="@/assets/chart333.png" alt="1" class="w-full" />
      <img src="@/assets/chart222.png" alt="1" class="w-full  mt-2" />
      <img src="@/assets/chart444.png" alt="1" class="w-full  mt-2" />
    </div>
    <van-tabbar v-model="active">
      <van-tabbar-item icon="home-o">主界面</van-tabbar-item>
      <van-tabbar-item icon="user-circle-o">我的</van-tabbar-item>
      <van-tabbar-item icon="chat-o">消息</van-tabbar-item>
    </van-tabbar>
  </div>
</template>
<script>
export default {
  name: "PageDemoApp",
  data() {
    return {
      active: 0
    };
  }
};
</script>

<style scoped>
.hide-scrollbar {
  /* 针对Firefox */
  scrollbar-width: none;

  /* 针对Chrome、Edge和Safari */
  -ms-overflow-style: none; /* IE and Edge */
}

.hide-scrollbar::-webkit-scrollbar {
  display: none; /* Chrome, Safari and Opera */
}
</style>
